<template>
    <div>
        <div class="title">
            精细化地理信息管理系统统一登录平台
        </div>
        <div class="content_box">
            <div class="item" @click="topath(1)" style="margin-right:11rem /* 176/16 */">
                <img src="@/assets/img/image_visual_schedule.png" />
                <p class="item_text">形象进度管理系统</p>
            </div>
            <div class="item" @click="topath(2)">
                <img src="@/assets/img/image_cost_management.png" />
                <p class="item_text">成本管理系统</p>
            </div>
        </div>
    </div>
</template>
<script>
export default {
    data() {
        return {};
    },
    methods:{
      topath(type){
        if(type==2){
          this.$router.push('/costmanagement');
          // localStorage.setItem('type', 1);
        }else if(type==1){
          
          this.$router.push('/');
        }
      }
    }
};
</script>
<style scoped lang="scss">
.title {
    width: 100%;
    font-size: 50px;
    font-family: PingFangSC-Medium, PingFang SC;
    font-weight: 500;
    color: #004fab;
    line-height: 70px;
    text-align: center;
    margin-top: 8.75rem /* 140/16 */;
}
.content_box {
    width: 100%;
    display: flex;
    margin-top: 6.5625rem /* 105/16 */;
    justify-content: center;
    align-items: center;
}
.item {
    width: 23.5rem /* 376/16 */;
    height: 26.25rem /* 420/16 */;
    background: #ffffff;
    box-shadow: 0px 10px 50px 0px rgba(0, 79, 171, 0.1);
    text-align: center;
    // margin-right:11rem /* 176/16 */;
}
.item:hover{
  
box-shadow: 0px 60px 60px 0px rgba(0, 79, 171, 0.2), 0px 10px 50px 0px rgba(0, 79, 171, 0.1);
}
.item img {
    width: 12.25rem /* 196/16 */;
    height: 12.25rem /* 196/16 */;
    margin-top: 5.6875rem /* 91/16 */;
    margin-bottom: 2.5625rem /* 41/16 */;
}
.item_text {
    font-size: 30px;
    font-family: PingFangSC-Medium, PingFang SC;
    font-weight: 500;
    color: #004fab;
    line-height: 42px;
}
</style>
